import { defineStore } from 'pinia'
import defaultSettings from '@/settings'
import { useDynamicTitle } from '@/utils/dynamicTitle'
import { ref } from 'vue'

const storageSetting = JSON.parse(localStorage.getItem('layout-setting')) || ''

const useSettingsStore = defineStore('settings', () => {
  const title = ref('')
  const theme = ref('')
  const sideTheme = ref('')
  const showSettings = ref('')
  const topNav = ref('')
  const tagsView = ref('')
  const fixedHeader = ref('')
  const sidebarLogo = ref('')
  const dynamicTitle = ref('')

  function init() {
    theme.value = storageSetting.theme || '#409EFF'
    sideTheme.value = storageSetting.sideTheme || defaultSettings.sideTheme
    showSettings.value = defaultSettings.showSettings
    topNav.value = storageSetting.topNav === undefined ? defaultSettings.topNav : storageSetting.topNav
    tagsView.value = storageSetting.tagsView === undefined ? defaultSettings.tagsView : storageSetting.tagsView
    fixedHeader.value = storageSetting.fixedHeader === undefined ? defaultSettings.fixedHeader : storageSetting.fixedHeader
    sidebarLogo.value = storageSetting.sidebarLogo === undefined ? defaultSettings.sidebarLogo : storageSetting.sidebarLogo
    dynamicTitle.value = storageSetting.dynamicTitle === undefined ? defaultSettings.dynamicTitle : storageSetting.dynamicTitle
  }
  // 设置网页标题
  function setTitle(value) {
    title.value = value
    useDynamicTitle()
  }

  init()
  return {
    title,
    theme,
    sideTheme,
    showSettings,
    topNav,
    tagsView,
    fixedHeader,
    sidebarLogo,
    dynamicTitle,
    setTitle
  }
})

export default useSettingsStore
